﻿<!--
    Customized Surface Button Control to allow image button utility
    -->
<UserControl x:Class="CitiSurface.CitiSurfaceButton"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:s="http://schemas.microsoft.com/surface/2008"
             mc:Ignorable="d" x:Name="root"
             d:DesignHeight="300" d:DesignWidth="300">
    <Grid>
        <s:SurfaceButton Background="Transparent" Width="40" Height="40"
                         RenderTransformOrigin="0.5, 0.5" Click="ImageButtonClick">
            <s:SurfaceButton.RenderTransform>
                <ScaleTransform />
            </s:SurfaceButton.RenderTransform>
            <s:SurfaceButton.Template>
                <ControlTemplate TargetType="s:SurfaceButton">
                    <Image HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
                           RenderTransformOrigin="0.5, 0.5" x:Name="ButtonImage"
                           Source="{Binding ElementName=root, Path=Source}"/>
                    <ControlTemplate.Triggers>
                        <Trigger Property="ButtonBase.IsPressed" Value="True">
                            <Trigger.EnterActions>
                                <BeginStoryboard>
                                    <Storyboard>
                                        <DoubleAnimation
                                        Storyboard.TargetProperty="(s:SurfaceButton.RenderTransform).(ScaleTransform.ScaleX)"
                                                         To="0.95" Duration="0:0:0.1" />
                                        <DoubleAnimation
                                        Storyboard.TargetProperty="(s:SurfaceButton.RenderTransform).(ScaleTransform.ScaleY)"
                                                         To="0.95" Duration="0:0:0.1" />
                                    </Storyboard>
                                </BeginStoryboard>
                            </Trigger.EnterActions>
                            <Trigger.ExitActions>
                                <BeginStoryboard>
                                    <Storyboard>
                                        <DoubleAnimation
                                        Storyboard.TargetProperty="(s:SurfaceButton.RenderTransform).(ScaleTransform.ScaleX)"
                                                         To="1" Duration="0:0:0.1" />
                                        <DoubleAnimation
                                        Storyboard.TargetProperty="(s:SurfaceButton.RenderTransform).(ScaleTransform.ScaleY)"
                                                         To="1" Duration="0:0:0.1" />
                                    </Storyboard>
                                </BeginStoryboard>
                            </Trigger.ExitActions>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </s:SurfaceButton.Template>
        </s:SurfaceButton>
    </Grid>
</UserControl>
